<template>
  <CommonPage :title="hospitalInfo?'更新医院':'添加医院'">
    <article class="flex flex-sub bg-white flex-column radius-lg padding">
        <n-scrollbar>
          <n-form :model="form" :rules="rules" ref="formRef" size="large" class="padding">
            <n-form-item label="图标" path="logo">
              <div class="flex flex-sub justify-center">
              <ImageUpload v-model:image="form.logo"></ImageUpload>
              </div>
            </n-form-item>
            <div class="flex justify-between">
              <n-form-item label="名称" path="hospital" class="basis-sm">
                <n-input placeholder="请输入医院名" v-model:value="form.hospital"/>
              </n-form-item>
              <n-form-item label="创办年份" path="logo" class="basis-sm">
                <n-input placeholder="请输入创办年份" v-model:value="form.establishYear"/>
              </n-form-item>
            </div>
            <div class="flex justify-between">
              <n-form-item label="规模" path="logo" class="basis-sm">
                <n-input placeholder="请输入规模" v-model:value="form.scale"/>
              </n-form-item>
              <n-form-item label="等级" path="logo" class="basis-sm">
                <n-input placeholder="请输入等级" v-model:value="form.level"/>
              </n-form-item>
            </div>
            <div class="flex justify-between">
              <n-form-item label="类别" path="type" class="basis-sm">
                <n-input placeholder="请输入类别" v-model:value="form.type"/>
              </n-form-item>
              <n-form-item label="性质" path="property" class="basis-sm">
                <n-input placeholder="请输入性质" v-model:value="form.property"/>
              </n-form-item>
            </div>
            <n-form-item label="地址" path="address">
              <n-input type="textarea" placeholder="请输入地址" v-model:value="form.address"/>
            </n-form-item>

            <n-form-item label="描述" path="description">
              <n-input type="textarea" placeholder="请输入描述" v-model:value="form.description"/>
            </n-form-item>
          </n-form>
        </n-scrollbar>
      <div class="flex flex-column padding">
        <n-button type="primary" @click="handleSubmit">提交</n-button>
      </div>
    </article>
  </CommonPage>
</template>

<script setup lang="ts">
import CommonPage from "@/components/page/CommonPage.vue";
import {onMounted, ref} from "vue";
import {useRoute} from "vue-router";
import ImageUpload from "@/components/common/upload/ImageUpload.vue";
import api from "@/api";


const list = ref([])
const form = ref({
  hospital: '',
  logo: '',
  address: '',
  type: '',
  property: '',
  scale: '',
  level: '',
  establishYear: '',
  description: '',
})
const formRef = ref()
const rules = ref({})
const mode=ref('create')


const route = useRoute()
const hospitalInfo = ref()


onMounted(() => {
  if (route.query.hospitalInfo) {
    //@ts-ignore
    hospitalInfo.value = JSON.parse(decodeURIComponent(route.query.hospitalInfo))
    Object.keys(form.value).forEach(key=>{
      //@ts-ignore
      form.value[key]=hospitalInfo.value[key]
      //@ts-ignore
      console.log(form.value[key])
    })
    mode.value='update'
  }
})
const handleSubmit = () => {
  console.log(form.value)
  if(mode.value==='create'){
    api.hospital.create(form.value).then(res=>{
      if(res&&res.data.code===0){
        window.$message.success(res.data.msg)
      }
    })
  }else if(mode.value==='update'){
    api.hospital.update({
      ...form.value,
      id:hospitalInfo.value.id
    }).then(res=>{
      if(res&&res.data.code===0){
        window.$message.success(res.data.msg)
      }
    })
  }
}
</script>

<style scoped>

</style>